<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <link rel="stylesheet" href="/wlzz/css/font.css">
    <link rel="stylesheet" href="/wlzz/css/xadmin.css">
    <script type="text/javascript" src="/wlzz/js/jquery.min.js"></script>
    <script type="text/javascript" src="/wlzz/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/wlzz/js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body class="layui-anim layui-anim-up">
    <div class="x-body">
      <div class="layui-row">
          <input type="text" id="input_user_info"  placeholder="请输入用户名或手机号或者用户ID" autocomplete="off" class="layui-input">
        <div  style="line-height:1.6em;margin-top:3px;float:right">
          <button class="layui-btn" onclick="searchUser()"><i class="layui-icon" title="搜索" >&#xe615;</i></button>
            <a class="layui-btn layui-btn-small" href="javascript:location.replace(location.href);" title="刷新">
                <i class="layui-icon" style="line-height:38px">ဂ</i></a>
        </div>
      </div>
      <#--<xblock>-->
        <#--<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>-->
        <#--<button class="layui-btn" onclick="x_admin_show('添加用户','/wlzz/member-add.html',600,400)"><i class="layui-icon"></i>添加</button>-->
        <#--<span class="x-right" style="line-height:40px">共有数据：88 条</span>-->
      <#--</xblock>-->
      <table class="layui-table">
        <thead>
          <tr>
            <th>ID</th>
            <th>用户名</th>
            <th>真实名</th>
            <th>手机</th>
            <th>创建时间</th>
            <th>生日</th>
            <th>学校名字</th>
            <th>任务数</th>
            <th>权限</th></tr>
        </thead>
        <tbody id="userTbody">

        </tbody>
      </table>
    </div>
    <div>
    <div id="demo7" style="text-align: center"></div>
    </div>
    <script>
      layui.use(['laypage', 'layer'], function() {
          var laypage = layui.laypage
                  , layer = layui.layer;
          var laypage = layui.laypage
          laypage.render({
              elem: 'demo7'
              ,count: ${user_number}
              ,layout: ['count', 'prev', 'page', 'next', 'skip']
              ,limit: 10
              ,jump: function(obj){
                  // console.log(obj)
                  // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                  // console.log(obj.limit); //得到每页显示的条数
                  $.post("/wlzz/backstage/pageForUserInfo",
                          {page:obj.curr,size:obj.limit},function(data){
                   var index = layer.load(2, {time: 7*1000,shade:0.5});
                              if(data.code==0){
                          console.log(data);
                          var dataList = data.data;
                            var allContent = "";
                          for(var i = 0;i<dataList.length;i++ ){
                              var content = '<tr>'+
                                      '            <td>'+dataList[i].user_id+'</td>'+
                                      '            <td>'+dataList[i].nick_name+'</td>'+
                                      '            <td>'+dataList[i].real_name+'</td>'+
                                      '            <td>'+dataList[i].phone+'</td>'+
                                      '            <td>'+dataList[i].create_time+'</td>'+
                                      '            <td>'+dataList[i].birth+'</td>'+
                                      '            <td>'+dataList[i].school_name+'</td>'+
                                      '            <td class="td-status">'+
                                      '              <span class="layui-btn layui-btn-normal layui-btn-mini" onclick="loadUserTask(\'/wlzz/backstage/user_task?user_id='+dataList[i].user_id+'\')">'+dataList[i].task_number+'</span></td>'+
                                      '            <td class="td-manage">'+
                                                        dataList[i].role_name+
                                      '            </td>'+
                                      '          </tr>';
                              allContent = allContent+content;
                          }
                          document.getElementById("userTbody").innerHTML=allContent;
                           layer.close(index);
                              }else{
                                  layer.close(index);
                                  layer.msg(data.msg, {icon: 5});
                              }
                  });
              }
          });
      });



      function loadUserTask(url){
          layer.open({
              type: 2,
              area: ['80%', '500px'],
              fix: false, //不固定
              maxmin: true,
              shadeClose: true,
              shade:0.4,
              title: '用户的任务列表详情简介',
              content: url
          });
      }
      function searchUser() {
          var input_user_info = document.getElementById("input_user_info").value;
          if(input_user_info==""){
              layer.msg('请输入搜索内容', {icon: 2});
              return;
          }
          var index = layer.load(2, {time: 7*1000,shade:0.5});
          $.post("/wlzz/backstage/search_user",
                  {input_user_info:input_user_info},function(data){
                        console.log(data);
                      if(data.code==0){
                          var dataList = data.data;
                          var allContent = "";
                          if(dataList.length==0){
                              layer.msg('没有找到您要的数据', {icon: 2});
                              layer.close(index);
                              return;
                          }
                          for(var i = 0;i<dataList.length;i++ ){
                              var content = '<tr>'+
                                      '            <td>'+dataList[i].user_id+'</td>'+
                                      '            <td>'+dataList[i].nick_name+'</td>'+
                                      '            <td>'+dataList[i].real_name+'</td>'+
                                      '            <td>'+dataList[i].phone+'</td>'+
                                      '            <td>'+dataList[i].create_time+'</td>'+
                                      '            <td>'+dataList[i].birth+'</td>'+
                                      '            <td>'+dataList[i].school_name+'</td>'+
                                      '            <td class="td-status">'+
                                      '              <span class="layui-btn layui-btn-normal layui-btn-mini" onclick="loadUserTask(\'/wlzz/backstage/user_task?user_id='+dataList[i].user_id+'\')">'+dataList[i].task_number+'</span></td>'+
                                      '            <td class="td-manage">'+
                                      dataList[i].role_name+
                                      '            </td>'+
                                      '          </tr>';
                              allContent = allContent+content;
                          }
                          document.getElementById("userTbody").innerHTML=allContent;
                           document.getElementById("demo7").innerHTML="";
                      }else{
                          layer.msg(data.msg, {icon: 2});

                      }
                      layer.close(index);
                  });
      }
    </script>
  </body>

</html>